<div [@routerTransition]>
    <div class="m-subheader">
        <div class="row align-items-center">
            <div class="mr-auto col-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    <span>月度工时统计</span>
                </h3>
                <span class="m-section__sub">
                    车间制造工时管理统计
                </span>
            </div>
            <div class="col text-right mt-3 mt-md-0" style="float: inherit;">
                <input
                    type="text"
                    class="form-control"
                    #dp="bsDatepicker"
                    [bsConfig]="bsConfig"
                    style="
                        width: 150px;
                        display: inline;
                        background-color: #fff !important;
                    "
                    locale="zh-cn"
                    placeholder="请选择月份"
                    bsDatepicker
                    [(bsValue)]="bsValue"
                    readonly
                />
                <select
                    #workshoFilterCombobox
                    name="workshoFilter"
                    class="form-control m--margin-left-20"
                    style="width: 150px; display: inline;"
                    [(ngModel)]="workshoFilter"
                    required
                >
                    <option value="">所有车间</option>
                    <option
                        *ngFor="let workShop of workShopList"
                        [value]="workShop.value"
                    >
                        {{ workShop.displayText }}</option
                    >
                </select>
                <label
                    class="m-checkbox m--margin-left-20"
                    style="width: 150px; display: inline;"
                >
                    <input
                        id="IsOnlyHaveNotRoutes"
                        type="checkbox"
                        name="IsOnlyHaveNotRoutes"
                        [(ngModel)]="onlyHaveNotRoutes"
                    />
                    无工时匹配
                    <span></span>
                </label>
                <button
                    type="button"
                    class="btn btn-primary blue m--margin-left-20"
                    (click)="statisticLaborHour()"
                >
                    <i class="fa fa-retweet"></i> 统计
                </button>
            </div>
        </div>
    </div>
</div>

<div class="m-content">
    <div class="m-portlet m-portlet--mobile">
        <div class="m-portlet__body">
            <div class="row margin-bottom-10">
                <div class="col-sm-3 text-left">
                    <span class="total-records-count">
                        共
                        {{ primengTableHelperExecution.totalRecordsCount }} 条
                    </span>
                </div>
                <div class="col-sm-9 text-right">
                    <button
                        type="button"
                        class="btn btn-success"
                        (click)="clickSaveLaborHour()"
                        [busyIf]="primengTableHelperExecution.isLoading"
                    >
                        <i class="fa fa-plus"></i> 保存
                    </button>
                    <button type="button" class="btn btn-primary blue">
                        <i class="fa fa-sync"></i> 刷新
                    </button>
                </div>
            </div>
            <div class="row align-items-center">
                <!--<Primeng-TurboTable-Start>-->
                <div
                    class="primeng-datatable-container"
                    [busyIf]="primengTableHelperExecution.isLoading"
                >
                    <p-table
                        #dataTable
                        [value]="processExecutionInfos"
                        sortMode="single"
                        [paginator]="false"
                        [lazy]="true"
                        scrollable="true"
                        ScrollWidth="100%"
                        responsive="primengTableHelperExecution.isResponsive"
                        resizableColumns="primengTableHelperExecution.resizableColumns"
                    >
                        <ng-template pTemplate="header">
                            <tr>
                                <th style="width: 300px;">
                                    任务信息
                                </th>
                                <th>
                                    车间任务
                                </th>
                                <th>
                                    车间
                                </th>
                                <th>
                                    班组
                                </th>
                                <th>
                                    执行比例
                                </th>
                                <th>
                                    数量
                                </th>
                                <th>
                                    执行时间
                                </th>
                            </tr>
                        </ng-template>
                        <ng-template
                            pTemplate="body"
                            let-rowData
                            let-rowIndex="rowIndex"
                        >
                            <tr
                                class="table table-striped- table-bordered table-hover table-checkable dataTable no-footer"
                                style="border: 1px solid #cccccc;"
                            >
                                <td
                                    style="width: 300px;"
                                    *ngIf="
                                        rowGroupMetadata[rowData.mainTaskCode]
                                            .index === rowIndex
                                    "
                                    [attr.rowspan]="
                                        rowGroupMetadata[rowData.mainTaskCode]
                                            .size
                                    "
                                >
                                    <div class="m-widget3">
                                        <div class="m-widget3__item">
                                            <div class="m-widget3__header">
                                                <div
                                                    class="m-widget3__user-img"
                                                >
                                                    <img
                                                        class="m-widget3__img"
                                                        src="assets/app/media/img/users/user1.jpg"
                                                        alt=""
                                                    />
                                                </div>
                                                <div class="m-widget3__info">
                                                    <span
                                                        class="m-widget3__username"
                                                    >
                                                        {{
                                                            rowData.mainTaskCode
                                                        }}
                                                    </span>
                                                    <br />
                                                    <span
                                                        class="m-widget3__time"
                                                    >
                                                        {{ rowData.name }}
                                                    </span>
                                                </div>
                                                <span
                                                    *ngIf="
                                                        rowData.isHaveNotLaborHour
                                                    "
                                                    class="m-widget3__status m--font-danger"
                                                >
                                                    Fail
                                                </span>
                                                <span
                                                    *ngIf="
                                                        !rowData.isHaveNotLaborHour
                                                    "
                                                    class="m-widget3__status m--font-success"
                                                >
                                                    Binding
                                                </span>
                                            </div>
                                            <div
                                                class="m-widget3__info m--margin-top-6"
                                            >
                                                <span class="m-widget3__author">
                                                    图号:
                                                </span>
                                                <span
                                                    class="m-widget3__info-author m--font-info"
                                                >
                                                    {{ rowData.picNo }}
                                                </span>
                                            </div>
                                            <div
                                                class="m-widget3__info m--margin-top-6"
                                            >
                                                <span class="m-widget3__author">
                                                    路线:
                                                </span>
                                                <span
                                                    class="m-widget3__info-author m--font-info"
                                                >
                                                    {{ rowData.routeString }}
                                                </span>
                                            </div>
                                            <div class="m-widget3__info">
                                                <span class="m-widget3__author">
                                                    型号:
                                                </span>
                                                <span
                                                    class="m-widget3__info-author m--font-info"
                                                >
                                                    {{ rowData.model }}
                                                </span>
                                            </div>
                                            <div class="m-widget3__info">
                                                <span class="m-widget3__author">
                                                    部段:
                                                </span>
                                                <span
                                                    class="m-widget3__info-author m--font-info"
                                                >
                                                    {{ rowData.part }}
                                                </span>
                                            </div>

                                            <div class="m-widget3__info">
                                                <span class="m-widget3__author">
                                                    工时:
                                                </span>
                                                <span
                                                    class="m-widget3__info-author m--font-info"
                                                >
                                                    <a
                                                        *ngIf="
                                                            !rowData.routeLaborHourString ||
                                                            rowData.routeLaborHourString ==
                                                                ''
                                                        "
                                                        href="javascript:;"
                                                        (click)="
                                                            editRouteModal.showEditRoute(
                                                                rowData.productionId,
                                                                rowData.routeString,
                                                                rowData.isTemporaryLaborHour
                                                            )
                                                        "
                                                        class="m-link m-link--state m-link--danger"
                                                        >空</a
                                                    >
                                                    <a
                                                        *ngIf="
                                                            rowData.routeLaborHourString &&
                                                            rowData.isTemporaryLaborHour
                                                        "
                                                        href="javascript:;"
                                                        (click)="
                                                            editRouteModal.showEditRoute(
                                                                rowData.productionId,
                                                                rowData.routeString,
                                                                rowData.isTemporaryLaborHour
                                                            )
                                                        "
                                                        class="m-link m-link--warning"
                                                        >{{
                                                            rowData.routeLaborHourString
                                                        }}</a
                                                    >
                                                    <a
                                                        *ngIf="
                                                            rowData.routeLaborHourString &&
                                                            !rowData.isTemporaryLaborHour
                                                        "
                                                        href="javascript:;"
                                                        (click)="
                                                            editRouteModal.showEditRoute(
                                                                rowData.productionId,
                                                                rowData.routeString,
                                                                rowData.isTemporaryLaborHour
                                                            )
                                                        "
                                                        class="m-link--info"
                                                        >{{
                                                            rowData.routeLaborHourString
                                                        }}</a
                                                    >
                                                </span>
                                            </div>
                                            <div
                                                class="m-widget3__body m--margin-top-10"
                                                *ngIf="
                                                    rowData.isHaveNotLaborHour
                                                "
                                            >
                                                <p class="m-widget3__text">
                                                    <i
                                                        class="flaticon-light"
                                                    ></i>
                                                    自动分析:<br />
                                                    <span
                                                        *ngIf="
                                                            rowData.isTemporaryLaborHour
                                                        "
                                                    >
                                                        工时为临时工时，请将其设置为长期。
                                                    </span>
                                                    <span>
                                                        有工时的车间为: [{{
                                                            rowData.haveLaborHourWorkshopList
                                                        }}],请检查是否有缺失。
                                                    </span>
                                                </p>
                                            </div>
                                            <div
                                                class="m-widget3__body m--margin-top-10"
                                                *ngIf="
                                                    !rowData.isHaveNotLaborHour
                                                "
                                            >
                                                <h5 class="m--font-primary">
                                                    工时共:{{
                                                        rowData.countLaborHourForMainTask
                                                    }}
                                                </h5>
                                                <p class="m-widget3__text">
                                                    <span>
                                                        各车间:
                                                        {{
                                                            rowData.countLaborHourForMainTaskString
                                                        }}
                                                    </span>
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <span
                                        class="m-badge m-badge--primary m-badge--dot"
                                        title="新任务"
                                        *ngIf="!rowData.isHadCalculated"
                                    ></span>
                                    <span
                                        class="m-badge m-badge--metal m-badge--dot"
                                        title="老任务"
                                        *ngIf="rowData.isHadCalculated"
                                    ></span>
                                    &nbsp;

                                    {{ rowData.batchTaskCode }}
                                </td>
                                <td>{{ rowData.dpt }}</td>
                                <td>{{ rowData.teamGroupName }}</td>
                                <td>
                                    {{ rowData.progressRatio | percent: "1.0" }}
                                </td>
                                <td>{{ rowData.quantity }}</td>
                                <td>
                                    {{
                                        rowData.creationTime
                                            | momentFormat: "YYYY-MM-DD HH:mm"
                                    }}
                                </td>
                            </tr>
                        </ng-template>
                    </p-table>
                    <div
                        class="primeng-no-data"
                        *ngIf="
                            primengTableHelperExecution.totalRecordsCount == 0
                        "
                    >
                        没有数据
                    </div>
                    <div class="primeng-paging-container">
                        <p-paginator
                            [rows]="
                                primengTableHelperExecution.defaultRecordsCountPerPage
                            "
                            #paginatorExecution
                            (onPageChange)="updateRowGroupMetaData($event)"
                            [totalRecords]="
                                primengTableHelperExecution.totalRecordsCount
                            "
                            [rowsPerPageOptions]="
                                primengTableHelperExecution.predefinedRecordsCountPerPage
                            "
                        >
                        </p-paginator>
                        <span class="total-records-count">
                            共
                            {{ primengTableHelperExecution.totalRecordsCount }}
                            条
                        </span>
                    </div>
                </div>
                <!--<Primeng-TurboTable-End>-->
            </div>
        </div>
    </div>
</div>
<editRouteModal
    #editRouteModal
    (modalSave)="updateRowGroupMetaData()"
></editRouteModal>
